<template>
  <div class="address-approve-bg">
    <el-card class="my-normal-table-bg">
      <div slot="header" class="page-title-bg">
        <div class="page-title">
          <div class="title-icon"></div>
          <span>查询结果</span>
          <span style="color: orange; font-size: 14px; margin-left: 20px;">
            <i class="el-icon-warning"></i>
            您有 <span style="color: dodgerblue;">{{count}}</span> 条待审核信息
          </span>
        </div>
      </div>
      <el-table ref="myTable" :data="tableData" tooltip-effect="dark" style="width: 100%" @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="55"></el-table-column>
        <el-table-column label="保单号" prop="contNo" align="center" min-width="160"></el-table-column>
        <el-table-column label="签约三级机构" prop="comName" align="center" min-width="160"></el-table-column>
        <el-table-column label="所属服务部组" prop="group" align="center" min-width="160"></el-table-column>
        <el-table-column label="代理人" prop="name" align="center" min-width="120"></el-table-column>
        <el-table-column label="原联系地址" prop="address1" align="center" min-width="320"></el-table-column>
        <el-table-column label="变更内容" prop="address2" align="center" min-width="320"></el-table-column>
        <el-table-column label="变更原因" prop="reason" align="center" min-width="320"></el-table-column>
        <el-table-column label="操作" align="center" min-width="220">
          <template>
            <div>
              <el-button type="text" size="small">审核通过，修改分单地址</el-button>
              <el-button type="text" size="small">审核回退</el-button>
            </div>
          </template>
        </el-table-column>
      </el-table>
    </el-card>
  </div>
</template>

<script>
export default {
  name: 'AddressApprove',
  data() {
    return {
      // 表格
      tableData: [
      	{
          comName: 'xxxx人寿无锡分公司',
          contNo: '0000024915501888',
          group: '谷秉清组',
          name: '季钰芳组',
          address1: '江苏省无锡市北塘区黄巷镇庄前村西陈巷108号',
          address2: '江苏省无锡市惠山区洛社镇正明村前旺桥12号',
          reason: '客户搬迁地址变更',
        },
      	{
          comName: 'xxxx人寿无锡分公司',
          contNo: '0002662918021888',
          group: '范小芳组',
          name: '朱巍',
          address1: '江苏省无锡市锡山区东亭街道老街路39-6号30室',
          address2: '江苏省无锡市惠山区洛社镇张镇家园D区167号401室',
          reason: '客户和子女同住，地址变更为子女住址',
        },
      	{
          comName: 'xxxx人寿无锡分公司',
          contNo: '0002350418541888',
          group: '领航二组',
          name: '乔东方',
          address1: '江苏省无锡市锡山区东北塘街道梓旺苑73号502室',
          address2: '江苏省无锡市滨湖区万达广场D区13-2801',
          reason: '客户搬迁地址变更',
        },
      	{
          comName: 'xxxx人寿无锡分公司',
          contNo: '0000313516271888',
          group: '季钰芳组',
          name: '李燕',
          address1: '江苏省无锡市南长区融创运河壹号33-202',
          address2: '江苏省无锡市江阴市周庄镇鸡龙山村后郭桥161号',
          reason: '客户搬迁地址变更',
        },
      	{
          comName: 'xxxx人寿无锡分公司',
          contNo: '0002248018631888',
          group: '倪羽舟组',
          name: '俞卫和',
          address1: '江苏省无锡市北塘区通惠中路59号',
          address2: '江苏省无锡市滨湖区军嶂新村264号101室',
          reason: '客户搬迁地址变更',
        },
      ],
      currentApproveList: [],
      count: 88
    }
  },
  mounted() {},
  methods: {
    handleSelectionChange(e) {
      console.log(e)
      this.currentApproveList = e;
    },
  },
}
</script>

<style lang="scss" scoped>
.my-normal-table-bg {
  padding: 16px;
  margin-top: 20px;
  .page-title-bg{
    display: flex;
    justify-content: space-between;
    .page-title {
      display: flex;
      align-items: center;
      font-size: 18px;
      font-family: PingFangSC-Medium, PingFang SC;
      font-weight: 500;
      color: #2a2a2a;
      margin: 0 10px;
      .title-icon {
        width: 8px;
        height: 22px;
        background-color: #082aff;
        margin-right: 10px;
      }
    }
  }
  ::v-deep.el-card__header {
    padding: 8px 0 10px 0;
    border: 0;
  }
}
</style>
